函數進階

函數也是一種資料型態,跟數字、字串、布林值等一樣都是一種資料型態，基本上這些資料能做的事情，函數也能做

一、函數基本使用方式：創建函數,呼叫函數

    //例子0
    function hello(){
        console.log("hello");
    }
    hello(); //顯示hello
    console.log(hello);  //顯示f hello({console.log("hello")}; 因為hello代表要顯示整個函數
    console.log(hello()); //顯示 hello undefined 因為呼叫函數時沒有設定return值所以是undefined
    console.log(typeof hello); //顯示 function 因為資料形態為函數

二、將函數儲存到變數內
函數可以當一個值或一個資料儲存到變數裡面

    //例子1
    const num1 = 10; //將數字存到變數內，下面示範將函數存到變數內
    const function1 = function hello1(){
    console.log("hello1");
    };
    function1(); //顯示hello1，呼叫變數裡面的函數
    console.log(function1); //顯示f hello1(){console.log("hello1");};
    console.log(function1()); //顯示hello1 undefined
    console.log(typeof function1); //資料型態 function
    
    //下面幾句不重要,亂嘗試的
    console.log(typeof hello1()); //錯誤 hello1 is not defined
    console.log(typeof hello1); //顯示undefine(深色表字串)
    console.log(typeof function1()); //顯示hello1 undefined（深色表字串）

將函數儲存到變數內,上面例子的hello1函數名稱其實是使用不到的，所以可以省略
下面示範將函數存到變數內，後面名稱省略的寫法

    //例子2
    const function2 = function (){
        console.log("hello2");
    }
    function2(); //顯示hello2,上面的例句即使省略函數名稱也沒有影響，可以正常顯示

函數提升：可以先呼叫函數,再創建或定義函數
上列的例子0和例子1.2的寫法差別：例子0可以做函數提升，另外兩種不行
下面用例子3(可函數提升).例子4（不可函數提升）做示範

    //例子3 
    hello3(); //函數提升（可以先呼叫函數再創建函數）
    function hello3(){
        console.log("hello3");
    }
    
    //例子4
    function4(); //Error: Cannot access 'function4' before initialization 把函數呼叫往前會出現錯誤訊息
    const function4 = function(){
    console.log("hello4");
    }
    //只能將function4();寫在後面

三、將函數儲存到物件內
函數可以當一個值或一個資料儲存到物件裡面
創建物件後把函數放到物件的值內

    //例子5
    const object5 = {
        fun:function hello5(){
            console.log("hello5");
        } 
    };
    object5.fun(); //顯示hello5 ,不能函數提升,用不到函數名稱所以可以省略函數名稱hello5

    //例子6 省略示範
    const object6 = {
        fun:function (){
            console.log("hello6");
        } 
    };
    object6.fun(); //顯示hello6 省略函數名稱仍照常顯示

四、將函數儲存到函數參數內

    //例子7 先回顧函數基本型態：傳入參數
    function show7(num7){
        console.log("num7");
    } 
    console.log(7); //顯示7

callback function:回調函數、回函、回呼函數
呼叫函數時給的參數是另一個函數

    //例子8
    function show8(fun8){
        fun8();
    }
    show8(function hello8(){
        console.log("hello8");
    }); //顯示hello8，hello8函數名稱一樣可省略,顯示結果相同

    //例子9 省略函數名稱
    function show9(fun9){
        fun9();
    }
    show9(function (){
        console.log("hello9");
    }); //顯示hello9，函數名稱省略,顯示結果相同

murmur
1.原來不同的資料型態有不同的顏色
console.log(1); //number =>藍色
console.log("1"); //string =>黑色
console.log(true); //boolean =>深藍色（網路上查的，但我分佈出來深淺）
console.log(undefined); //undefined =>淺灰
console.log(null); //null =>淺灰

2.callback function有點難理解，應該可以寫出來但是需要自己繞繞那個邏輯

3.每次提到省略寫法我就有一點害怕,一省略就會開始想（所以他是省略了這個所以才會變成這樣%^&)腦袋都還要再轉一下，程式碼變簡單了但是我的腦袋卻需要轉個彎才能明白，希望多熟悉後會變成直覺反應吧

筆記對應：購物網站 (2)